const app = getApp()

Page({

  data: {
    sysWidth: 0,
    sysHeight: 0,
    id: 0,
    privinceName: '北京',
    pinyin: '',
    name1: '张',
    name2: '三',
    allNum: 3,
    male: 2,
    female: 1,
    shareTempFilePath: ''
  },

  onLoad: function (options) {
    var that = this

    this.setData({
      sysWidth: app.globalData.systemInfo.windowWidth,
      sysHeight: app.globalData.systemInfo.windowHeight,
      id: options.id,
      privinceName: options.name,
      pinyin: options.pinyin
    })

    wx.setNavigationBarTitle({
      title: that.data.privinceName + '重名查询'
    });

    // 画布默认效果
    var heightCell = that.data.sysHeight / 104
    this.setData({
      heightCell: that.data.sysHeight / 104
    })
    const ctx = wx.createCanvasContext('canvas');
    ctx.drawImage('/images/warning.jpg', that.data.sysWidth * 0.35, that.data.sysHeight * 0.35, heightCell * 11, heightCell * 11)
    ctx.setFontSize(heightCell * 3.3)
    ctx.setFillStyle('#cccccc')
    let beforetext = '请先填写需要查询的名字'
    ctx.fillText(beforetext, (that.data.sysWidth - ctx.measureText(beforetext).width) / 3, that.data.sysHeight * 0.55)
    ctx.stroke()
    ctx.draw(false, that.getTempFilePath)
  },

  formSubmit: function (e) {
    var that = this
    var str_name1 = e.detail.value.inputname1 + ''
    var str_name2 = e.detail.value.inputname2 + ''
    if (e.detail.value.inputname1 && e.detail.value.inputname2) {
      if (e.detail.value.inputname1.length > 2) {
        wx.showModal({
          title: '- 温馨小提示 -',
          content: '姓氏最大最能输入两个字哦~',
          showCancel: false,
          cancelText: '取消',
          cancelColor: '#000000',
          confirmText: '朕知道了',
          confirmColor: '#3CC51F',
        });
        return
      } else if (e.detail.value.inputname2.length > 3) {
        wx.showModal({
          title: '- 温馨小提示 -',
          content: '名字最大最能输入三个字哦~',
          showCancel: false,
          cancelText: '取消',
          cancelColor: '#000000',
          confirmText: '朕知道了',
          confirmColor: '#3CC51F',
        });
        return
      }

      var pattern = /^[\u4E00-\u9FA5]{1,5}$/;
      let test1 = pattern.test(str_name1)
      let test2 = pattern.test(str_name2)
      if (test1 && test2) {
        that.setData({
          name1: e.detail.value.inputname1,
          name2: e.detail.value.inputname2
        })
      } else {
        wx.showModal({
          title: '- 温馨小提示 -',
          content: '只能输入中文哦~',
          showCancel: false,
          cancelText: '取消',
          cancelColor: '#000000',
          confirmText: '朕知道了',
          confirmColor: '#3CC51F',
        });
        return
      }
    } else {
      wx.showModal({
        title: '- 温馨小提示 -',
        content: '姓氏和名字不能为空哟~',
        showCancel: false,
        cancelText: '取消',
        cancelColor: '#000000',
        confirmText: '朕知道了',
        confirmColor: '#3CC51F',
      });
      return
    }
    // 请求数据
    wx.request({
      url: app.globalData.url + 'cmcxs/query_province',
      data: {
        surname: that.data.name1,
        name: that.data.name2,
        province: that.data.pinyin
      },
      method: 'POST',
      success: (res) => {
        that.setData({
          allNum: res.data.data.all,
          male: res.data.data.male,
          female: res.data.data.female
        })

        that.drawCanvas()
      }
    });
  },

  onShareAppMessage: function () {
    return {
      title: '快来看看全国有多少人跟你重名',
      imageUrl: '/images/share.jpg',
      path: '/pages/index/index'
    }
  },

  // 绘制canvas
  drawCanvas: function () {
    wx.showLoading({
      title: "搜索结果中",
    });

    var that = this
    var heightCell = Math.floor(that.data.sysHeight / 104)
    that.setData({
      heightCell: Math.floor(that.data.sysHeight / 104)
    })


    var name = that.data.name1 + that.data.name2
    const ctx = wx.createCanvasContext('canvas');
    // 背景
    ctx.drawImage('/images/r1.jpg', 0, 0, that.data.sysWidth - (heightCell * 13), that.data.sysHeight * 0.62)
    // 标题
    setTimeout(() => {
      ctx.setFontSize(heightCell * 3.3)
      ctx.setFillStyle('#2b2b2b')
      let textTitle = that.data.privinceName + '同名同姓查询报告'
      ctx.fillText(textTitle, (that.data.sysWidth - ctx.measureText(textTitle).width) / 3, that.data.sysHeight * 0.12)
    }, 300);
    // 名字
    setTimeout(() => {
      ctx.setFontSize(heightCell * 5)
      ctx.setFillStyle('#FF9700')
      ctx.fillText(name, (that.data.sysWidth - ctx.measureText(name).width) / 3 + 20, that.data.sysHeight * 0.21)
    }, 600);
    // 总计
    setTimeout(() => {
      ctx.setFontSize(heightCell * 3.3)
      ctx.setFillStyle('#2b2b2b')
      let textAll = that.data.privinceName + '至少有' + that.data.allNum + '人'
      ctx.fillText(textAll, (that.data.sysWidth - ctx.measureText(textAll).width) / 3, that.data.sysHeight * 0.28)
    }, 900);

    // 男 人数
    setTimeout(() => {
      ctx.setFontSize(heightCell * 3.3)
      ctx.setFillStyle('#2b2b2b')
      let textMale = '其中男生' + that.data.male + '人'
      ctx.fillText(textMale, (that.data.sysWidth - ctx.measureText(textMale).width) / 3 + 20, that.data.sysHeight * 0.38)
    }, 1200);

    // 女 人数
    setTimeout(() => {
      ctx.setFontSize(heightCell * 3.3)
      ctx.setFillStyle('#2b2b2b')
      let textFemale = '女生' + that.data.female + '人'
      ctx.fillText(textFemale, (that.data.sysWidth - ctx.measureText(textFemale).width) / 3 + 20, that.data.sysHeight * 0.46)
    }, 1500);

    // 二维码
    setTimeout(() => {
      if (app.globalData.share) {
        ctx.drawImage('/images/erweima.jpg', that.data.sysWidth * 0.54, that.data.sysHeight * 0.44, heightCell * 11, heightCell * 11)
      }
    }, 1800);

    // 绘制
    setTimeout(() => {
      ctx.stroke()
      ctx.draw()
      that.getTempFilePath();
      wx.hideLoading();
    }, 2000);
  },

  getTempFilePath: function () {
    var that = this

    wx.canvasToTempFilePath({
      canvasId: 'canvas',
      success: (res) => {

        that.setData({
          shareTempFilePath: res.tempFilePath
        })
      }
    })
  },

  // 点击图片保存本地
  saveImg: function () {
    wx.saveImageToPhotosAlbum({
      filePath: this.data.shareTempFilePath,
      success: (res) => {
        wx.showToast({
          title: '图片已保存',
          icon: 'none',
          duration: 1500
        });
      },
      fail: (err) => {
        console.log(err)
      }
    })
  },

  //点击图片进行预览
  previewImg: function (e) {
    var img = this.data.shareTempFilePath
    wx.previewImage({
      current: img,
      urls: [img]
    })
  },
})